<template>
  <table-row-detail-dialog
    ref="CDialog"
    @confirm="handleConfirm"
    :needRefresh="true"
    :maxHeight="true"
    dialogTitle="选择电梯"
    dialogWidth="800px"
    class="Dialog"
    :config="config"
    :multiple="multiple"
  >
    <picker ref="picker" style="height: 70vh" :config="config"></picker>
  </table-row-detail-dialog>
</template>

<script>
import picker from './picker';
import TableRowDetailDialog from '@/components/TableRowDetailDialogNew/index';
import { list as listEstate } from '@/api/elevator-archives/configuration/housingMgt';
import { list as listElevators } from '@/api/elevator-archives/info';
export default {
  name: 'AreaPicker',
  components: {
    TableRowDetailDialog,
    picker
  },
  props: {
    config: {
      type: Array,
      default: () => [
        {
          name: 'estateName',
          id: 'estateId',
          remote: listEstate
        },
        {
          name: 'elevatorName',
          id: 'elevatorId',
          remote: listElevators
        }
      ]
    },
    multiple: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {};
  },

  methods: {
    async show(current) {
      this.$refs.CDialog.show('edit');
      await this.$nextTick();
      if (current) {
        if (this.multiple) {
          this.$refs.picker.setChooseData(current);
        } else {
          this.$refs.picker.setCurrent(current);
        }
      }
    },
    handleConfirm() {
      let params;
      if (this.multiple) {
        params = this.$refs.picker.getChooseData();
      } else {
        params = this.$refs.picker.getData();
      }

      if (!params) return;
      this.$emit('submit', params);
      this.$refs.CDialog.hide();
    }
  }
};
</script>
